<template>
	<view class="container-root">
		<view class="login-title">
			<text>爱视TV数字电视</text>
		</view>
		<view class="login-input">
			<view class="login-user-pwd">
				<image class="login-image" src="../../static/images/login_phone.png" mode=""></image>
				<input type="text" value="" placeholder="请输入机顶盒号" @input="onStbidInput"/>
			</view>
			<view class="login-user-pwd">
				<image class="login-image" src="../../static/images/login_password.png" mode=""></image>
				<input type="text" password  value="" placeholder="请输入密码" @input="onPasswordInput"/>
			</view>
		</view>
		<view class="login-forget" @tap='onForget'>
			<text>忘记密码？</text>
		</view>
		<view class="login-submit" hover-class='login-submit-hover' @tap="onStbLogin">
			<text>登录</text>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	}from 'vuex'  //导入vuex的mapState和mapMutations方法
	export default {
		data() {
			return {
				stbID:'',
				passWord:''
			}
		},
		computed:{
			...mapState(['hasLogin']), //对全局变量hasLogin进行监控
		},
		methods: {
			...mapMutations(['login']), //对全局方法 login进行监控
			onStbidInput(e){
				this.stbID = e.detail.value;
			},
			
			onPasswordInput(e){
				this.passWord = e.detail.value;
			},
			
			onForget(){
				uni.showToast({
					title: '请前往营业厅办理该业务！',
					icon:"none"
				})
			},
			toIndex(provider){
				this.login(provider)
				uni.switchTab({
					url: '../index/index'
				})
			},
			onStbLogin(){
				if(this.stbID.length > 0 && this.passWord.length > 0){
					apis.Userlogin({
						"name":this.cardID,
						"password":this.passWord,
						"type":'1'//0-用户，1-机顶盒，2-卡号，3-扫描
					}).then(res=>{
						//console.log(res);
						
						if(res[1].data.status==200 && res[1].data.content){
							this.toIndex(res[1].data)
						}
						else{
							uni.showToast({
								title: res[1].data.message,
								icon: "none"
							});
							this.logout()
						}										
					})
				}
				else{
					uni.showToast({
						title: '机顶盒号或密码格式不正确!请重新输入',
						icon: "none"
					})
				}	
			}
		}
	}
</script>

<style scoped>

</style>
